<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE HTML>
<html>
<head>
    <title>抽奖</title>
    <link rel="stylesheet" href="<c:url value='/resource/css/osyear/main.css'></c:url>">
    <script type="text/javascript" src="<c:url value='/resource/js/jquery-2.0.min.js'/>"></script>
    <script type="text/javascript" src="<c:url value='/resource/js/osyear/script.js' />" ></script>
</head>
<body>
<bgsound id="mt" src=""></bgsound>
<div class="choujiang" id="choujiang">
    <div class="choujiang_kuai"></div>
    <div class="choujiang_xiala">
        <c:forEach var="luck" items="${lucky}" varStatus="vs">
            <li value="${luck.id}" votes="${luck.votes}" num="${luck.num}">${luck.name}</li>
        </c:forEach>
        <input type="hidden" id="awardid" value="${lucky[0].id}" votes="${lucky[0].votes}" num="${lucky[0].num}"/>
    </div>
    <div class="main" id="main1">
        <img src="<c:url value='/resource/images/osyear/choujiang_main.png' />" id="img1"/>
        <div class="main1">
            <div class="top" id="main1_top">${lucky[0].name}</div>
            <div class="center">
                <div class="center_main">
                    <div class="center_main_lf">
                        <span id="ResultNum" style="font-size:50pt;font-family:Verdana;color:red;">000</span>
                    </div>
                <div class="center_main_rt">
                    <div class="center_main_rt_k"></div>
                </div>
                </div>
            </div>
        </div>
        <div class="bottom" id="button">
            <ul class="ul1" id="result"></ul>
        </div>
    </div>
</div>
<script>
    var getResultTimes=0;//抽奖次数
    var totalnum;
    var prenum;

    var flag = 1;
    function displayMusic()
    {
        if(flag==0)
        {
            $("#mt").attr("src","");
            flag =1;
        }
        else{
            $("#mt").attr("src","<c:url value='/static/osyear/images/m.mp3'/>");
            flag = 0 ;
        }

    }
    /**
     * 不同奖项不同抽奖结果样式
     * @param textval
     */
    var resultLiClass = "myli li1";
    function changeResultClass(num){
        if("1"==num){
            resultLiClass = "myli li2";
            $("li.myli").attr("class","myli li2");
        }else if("2"==num){
            resultLiClass = "myli li3";
            $("li.myli").attr("class","myli li3");
        }else{
            resultLiClass = "myli li1";
            $("li.myli").attr("class","myli li1");
        }
    }
    function getContentSize() {
        var img1 = document.getElementById("img1").offsetWidth;
        cm = img1 + "px";
        document.getElementById("main1").style.width =cm;
    }
    window.onload = getContentSize; //页面加载时调用getContentSize()
    window.onresize = getContentSize; //当改变窗口大小时会出发getContentSize()

    /***
     * 选择奖项
     */
    $(document).ready(function() {
        totalnum = $("#awardid").attr("num");
        prenum = $("#awardid").attr("votes");
        $(".choujiang_kuai").click(function(){
            $(".choujiang_xiala").slideDown();
        });
        var toptext = $('#main1_top');
        var selectmain = $('.choujiang_xiala');
        var lis=selectmain.find('li');
        for(var i=0;i<lis.length;i++)
        {
            lis[i].onclick=function(){
                $('#ResultNum').html("000");
                $("#result").html("");
                var textval = $(this).html();
                selectmain.hide();
                toptext.text(decodeURIComponent(textval));
                changeResultClass($(this).attr("num"));
                $("#awardid").val($(this).val());
                $("#awardid").attr("votes",$(this).attr("votes"));
                $("#awardid").attr("num",$(this).attr("num"));
                $("li.myli").remove();
                $("div.num").removeAttr("style");
                getResultTimes=0;
                totalnum = $(this).attr("num");
                prenum = $(this).attr("votes");
            }
        }
        //抽奖按钮
        $(".center_main_rt_k").click(function(){
            if(prenum*getResultTimes>=totalnum){
                alert("亲，本奖项被抽完了哦(⊙o⊙)~~~");
                return false;
            }
            $(this).toggleClass("center_main_rt_k1");
            displayMusic();//背景音乐
            beginRndNum(this);
        });
    });

</script>
</body>
</html>